<template>
    <section>
        <el-col :span="24">
            <el-form inline>
                <el-form-item>
                    <el-input v-model.trim="form.bill_no" size="small" style="width:250px;" placeholder="单据编号" @keyup.enter.native="searchBtn" clearable></el-input>
                </el-form-item>
                <el-form-item>
                    <el-select v-model="form.type" placeholder="单据类型" style="width: 180px;" size="small" clearable>
                        <el-option v-for="(label, type) in billTypes" :label="label" :value="type"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" class="el-icon-search" @click="searchBtn" size="small" :loading="btnLoading">查询</el-button>
                </el-form-item>
            </el-form>
        </el-col>
        <el-col :span="24">
            <el-table :data="data" style="width: 100%" :max-height="tableHeight" v-loading="loading" size="mini">
                <el-table-column prop="bill_no" label="单据编号" width="250"></el-table-column>
                <el-table-column prop="type" label="单据类型" width="180">
                    <template slot-scope="{row}">
                        <el-tag size="mini">{{billTypes[row.type] || row.type}}</el-tag>
                    </template>
                </el-table-column>
                <el-table-column prop="kid_id" label="金蝶ID" width="100"></el-table-column>
                <el-table-column prop="data" label="推送数据">
                    <template slot-scope="{ row }">
                        <el-popover placement="right-start" width="400" trigger="click">
                            <div style="overflow-y: auto" :style="{'max-height': tableHeight+'px'}">
                                <jsonview :json="JSON.parse(row.data)"></jsonview>
                            </div>
                            <div slot="reference" class="ellipsis">{{row.data}}</div>
                        </el-popover>
                    </template>
                </el-table-column>
                <el-table-column prop="error" label="响应信息">
                    <template slot-scope="{ row }">
                        <el-popover placement="top" width="400" trigger="click">
                            <div style="overflow-y: auto" :style="{'max-height': tableHeight+'px'}">
                                <jsonview :json="JSON.parse(row.error)"></jsonview>
                            </div>
                            <div slot="reference" class="ellipsis">{{row.error}}</div>
                        </el-popover>
                    </template>
                </el-table-column>
                <el-table-column prop="create_time" label="创建时间" width="135"></el-table-column>
            </el-table>
            <!--翻页栏-->
            <div style="margin-top: 4px;overflow: hidden;float: right;">
                <Page :total="total" :current="page" :page-size="limit" show-total @on-change="pageChange"></Page>
            </div>
        </el-col>
    </section>
</template>

<script>

import {kingdeeList} from "@/api/log/log";
import jsonview from "../../components/jsonview";

export default {
    name: "sys_log_kingdeePush",
    components:{jsonview},
    data() {
        return {
            tableHeight: window.innerHeight - 210,
            selectIndex: 0,
            btnLoading: false,
            loading: false,
            page: 1,
            limit: 20,
            total: 0,
            data: [],
            user: {},
            nodeActions: [],

            form:{bill_no: "", type: ""},
            billTypes:{
                1 : "赠送",
                2 : "借出",
                21 : "借转销售",
                22 : "借转内购",
                3 : "归还",
                4 : "绣花暂估",
                5 : "绣花应付",
                6 : "成衣应付",
                7 : "成衣罚款",
                71 : "成衣额外费用",
                8 : "绣花\成衣对账",
                9 : "采退返修对账单-正数",
                91 : "采退返修对账单-负数"
            }

        }
    },
    created() {
        this.user = this.$store.getters.user;
        this.nodeActions = this.user.node_actions[this.$route.meta.id] ? this.user.node_actions[this.$route.meta.id] : [];
    },
    methods: {
        //搜索按钮
        searchBtn() {
            this.page = 1;
            this.getData();
        },
        //翻页
        pageChange(page) {
            this.page = page;
            this.getData();
        },
        //获取数据
        getData() {
            let param = {
                page: this.page,
                limit: this.limit
            };
            param = Object.assign(param, this.form);
            this.loading = true;
            kingdeeList(param).then((res) => {
                this.loading = false;
                this.total = res.data.total;
                this.data = res.data.data;
            }).catch(() => {
                this.loading = false;
            });
        },
    },
    mounted() {
        this.searchBtn();
    }
}
</script>

<style scoped>
.ellipsis {
    overflow: hidden; /* 确保超出容器的内容被裁剪 */
    white-space: nowrap; /* 确保文本在一行内显示 */
    text-overflow: ellipsis; /* 超出部分显示省略号 */
}
</style>
